<template>
	<view class="boxhead">
		<view class="boxtop">
			<text class="text">修改商品信息</text>
		</view>
		<view class="imgbox">
			<text class="text">商品图片</text>
			<image  @click="btnimg" class="image" :src="src"></image>
		</view>
		<view class="box">
			<view class="box1">
				<text class="text">商品名称</text>
				<input type="text" class="text1" v-model="list.name" placeholder="请输入">
			</view>
			<view class="br"></view>
			<view class="box1">
				<text class="text">商品编号</text>
				<input type="text" disabled="false" class="text1" v-model="list.id" placeholder="请输入">
			</view>
			<view class="br"></view>
			<view class="box1">
				<text class="text">商品规格</text>
				<input type="text" class="text1" v-model="list.spe" placeholder="请输入">
			</view>
			<view class="br"></view>
			<view class="box1">
				<text class="text">商品数量</text>
				<input type="number" class="text1" v-model="list.num" placeholder="请输入">
			</view>
			<view class="br"></view>
			<view class="box1">
				<text class="text">商品单位</text>
				<input type="text" class="text1" v-model="list.unit" placeholder="请输入">
			</view>
			<view class="br"></view>
			<view class="box1">
				<text class="text">所在仓库</text>
				<input type="text" class="text1" v-model="list.wid" placeholder="请输入">
			</view>
			<view class="br"></view>
			<view class="box1">
				<text class="text">进价</text>
				<input type="number" class="text2" v-model="list.purchase_price" placeholder="请输入">
			</view>
			<view class="br"></view>
			<view class="box1">
				<text class="text">售价</text>
				<input type="text" class="text2" v-model="list.retail_price" placeholder="请输入">
			</view>
		</view>
		<view class="boxhead">
			<uni-collapse  ref="collapse">
				<uni-collapse-item  title="其他信息">
					<view class="box"> 
						<view class="box1">
							<text class="text">报警数量</text>
							<input type="text" class="text1" v-model="list.alarmnum" placeholder="请输入">
						</view>
						<view class="br"></view>
						<view class="box1">
							<text class="text">生产日期</text>
							<view class="datetime">
								<uni-datetime-picker type="date" @change="produc" v-model="production"></uni-datetime-picker>
							</view>
						</view>
						<view class="br"></view>
						<view class="box1">
							<text class="text">保质日期</text>
							<view class="datetime">
								<uni-datetime-picker type="date" @change="expira" v-model="expiration"></uni-datetime-picker>
							</view>
						</view>
						<view class="br"></view>
						<view class="box1">
							<text class="text">入库员id</text>
							<input type="text" class="text1" disabled="false" v-model="list.whentryid" placeholder="请输入">
						</view>
						<view class="br"></view>
						<view class="box1">
							<text class="text">出库员id</text>
							<input type="text" class="text1" disabled="false" v-model="whoutid" placeholder="请输入">
						</view>
						<view class="br"></view>
						<view class="box1">
							<text class="text">供应商id</text>
							<input type="text" class="text1" v-model="list.supplier_id" placeholder="请输入">
						</view>
					</view>
				</uni-collapse-item>
			</uni-collapse>
		</view>
		<view class="boxbtn">
			<button @click="back" class="btn">取消</button>
			<button @click="updata" class="btn1">保存</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:{},production_date:'',expiration_date:'',src:''
			}
		},
		computed:{
			whoutid(){
				var whout = this.list.whoutid
				if(typeof(whout) == 'number'){
					return this.list.whoutid
				} else {
					return "空"
				}
			}
		},
		onLoad:function(option){
			var opt = JSON.parse(option.item)
			this.list = opt;
			this.src = opt.img
			this.production = this.list.production_date.substring(0,10)
			this.expiration = this.list.expiration_date.substring(0,10)
		},
		methods:{
			produc(e) {
				this.production_date = e
			},
			expira(e) {
				this.expiration_date = e
			},
			async btnimg(){
				const res = await this.Upload({
					url:'api/upload/postimage'
				});
				this.src=  res.data.slice(8,80)
			},
			back(){
				uni.showModal({
					title: '提示',
					content: '是否结束此操作',
					success: function (res) {
						if (res.confirm) {
							uni.reLaunch({
								url:'/pages/super/sup-commodity/sup-commodity'
							})
						}
					}
				});
			},
			async updata(){
				const res = await this.Request({
					url:'/api/stock/upstockdata',
					method:"PUT",
					data:{
						img:this.src,name:this.list.name,spe:this.list.spe,num:this.list.num,
						unit:this.list.unit,wid:this.list.wid,alarmnum:this.list.alarmnum,production_date:this.production,
						expiration_date:this.expiration,supplier_id:this.list.supplier_id,id:this.list.id,
						purchase_price:this.list.purchase_price,retail_price:this.list.retail_price
					}
				})
				if(res.data.affectedRows =1){
					uni.showToast({
						title: '更新成功'
					})
					setTimeout(() => {
						uni.reLaunch({
							url:'/pages/super/sup-commodity/sup-commodity'
						})
					},500)
				}
			}
		},
	}
</script>

<style lang="scss">
	input{
		width: 100px;
	}
	.boxhead{
		margin-top: 10px;
		.boxtop{
			width: 100%;
			background-color: #efefef;
			display: flex;
			border-bottom: 1px solid #ccc;
			.text{
				margin: 5px 0 5px 5px;
				font-size: 110%;
				font-weight: 700;
				color: #d3d3d3;
			}
		}
		.imgbox{
			display: flex;
			.text{
				margin: auto 0;
				font-size: 110%;
				font-weight: 700;
				margin-left: 30px;
			}
			.image{
				height: 50px;
				width: 50px;
				margin-left: 100px;
			}
		}
		.box{
			border-top: 2px solid #ccc;
			border-bottom: 2px solid #ccc;
			border-radius: 10px;
			.br{
				height: 1px;
				margin-left: 10%;
				background: #a5a5a5;
			}
			.box1{
				display: flex;
				margin-top: 10px;
				margin-bottom: 10px;
				.datetime{
					width: 180px;
					margin-left: 50px;
				}
				.text{
					margin: auto 0;
					margin-left: 30px;
					font-weight: 600;
					font-size: 110%;
				}
				.text1{
					margin-left: 120px;
				}
				.text2{
					margin-left: 150px;
				}
			}
		}
	}
	.boxbtn{
		display: flex;
		margin-top: 20px;
		.btn{
			width: 100px;
			margin-left: 80px;	
		}
		.btn1{
			width: 100px;
			margin-left: -70px;
		}
	}
</style>